<template>
    <div>
        <h1>门店详情</h1>
        <table class="table table-bordered" border="1px">
            <tbody>
                <tr>
                    <td>房间号</td>
                    <td>
                        {{ info.HouseNumber }}
                    </td>
                </tr>
                <tr>
                    <td>房型类型名称</td>
                    <td>
                        {{ info.HouseTypeName }}
                    </td>
                </tr>
                <tr>
                    <td>房型图片</td>
                    <td>
                        <img :src="info.Photo" width="120px" height="100px" v-if="info.Photo">
                    </td>
                </tr>
                <tr>
                    <td>房型价格</td>
                    <td>
                        {{ info.Money }}
                    </td>
                </tr>
                <tr>
                    <td>房型面积</td>
                    <td>
                        {{ info.Area }}
                    </td>
                </tr>
                <tr>
                    <td>是否有窗</td>
                    <td>
                        {{ info.IsWin == 1 ? "有窗" : "无窗" }}
                    </td>
                </tr>
                <tr>
                    <td>简介</td>
                    <td>
                        {{ info.Desc }}
                    </td>
                </tr>
                <tr>
                    <td>是否加床</td>
                    <td>
                        {{ info.IsBed == 1 ? "可以加床" : "不可以加床" }}
                    </td>
                </tr>
                <tr>
                    <td>是否含有早餐</td>
                    <td>
                        {{ info.Breakfast == 1 ? "包含早餐" : "不包含" }}
                    </td>
                </tr>
                <tr>
                    <td>最多入住人数</td>
                    <td>
                        {{ info.PeopleCount }}
                    </td>
                </tr>
                <tr>
                    <td>房型状态</td>
                    <td>
                        {{ info.State == 1 ? "启用" : "禁用" }}
                    </td>
                </tr>
                <tr>
                    <td></td>
                    <td>
                        
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue'
import axios from 'axios';
import { useRouter,useRoute } from 'vue-router'
const router = useRouter();
const route = useRoute();


let hhh: any = ref([])

let info: any = reactive({
    "Id": 0,
    "HouseNumber": "",
    "HouseTypeName": "",
    "Photo": "",
    "Money": '',
    "Area": '',
    "IsWin": 1,
    "Desc": "",
    "IsBed": 1,
    "Breakfast": 1,
    "PeopleCount": '',
    "State": 1,
})

onMounted(() => {
    bind();
    find();
})

const bind = () => {
    axios({
        url: 'https://localhost:7056/api/House/BindHType',
        method: 'get',
    })
        .then(res => {
            console.log(res.data);
            Object.assign(hhh.value, res.data);
        })
}

const find = () => {
    axios({
        url: 'https://localhost:7056/api/House/Find',
        method: 'get',
        params:{
            id:route.query.id
        }
    })
        .then(res => {
            console.log(res.data);
            Object.assign(info, res.data);
        })
}



</script>

<style scoped></style>